<template>
  <div class="app-container">

    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>SD卡信息</span>
      </div>
      <div  class="text item">
        <div>
          <span>SD卡状态：</span><el-tag :type="tagType">{{sdStatusText}}</el-tag>
        </div>
        <br>
        <div v-show="sdStatus">
          已用空间<span style="margin-right: 20px;"> {{usedsize}} GB</span>
          总空间<span> {{totalsize}} GB</span>
          <el-row>
            <el-col :span="8">
              <el-progress :percentage="percentage"></el-progress>
            </el-col>
          </el-row>
        </div>
      </div>
    </el-card>




  </div>
</template>

<script>
    export default {
        name: "sdCard",
      data() {
        return {
          percentage: 0,
          customColor: '#409eff',
          sdStatus:0,
          sdStatusText:0,
          tagType:'success',
          totalsize:0,
          usedsize:0
        };
      },methods:{
        getsdcardinfo:function(){
          var _this=this
          _this.postAjax({
            method:'getsdcardinfo',
            params:{}
          }).then(function (res) {
            console.log(res);
            if(res.result==0){
              var data=res.params
              // debugger

              _this.sdStatusText=data.sdcardexist==1?'已插入':'未插入'
              _this.sdStatus=data.sdcardexist
              _this.tagType=data.sdcardexist==1?'success':'danger'
              _this.totalsize=parseInt(data.totalsize/1024*100)/100
              _this.usedsize=parseInt(data.usedsize/1024*100)/100
              // _this.percentage=((data.usedsize/1024)/(data.totalsize/1024)).toFixed(2)*100
              _this.percentage=parseInt(data.usedsize/data.totalsize*10000)/100

              console.log(_this.sdStatus);
            }else{
              _this.tips(res.errorInfo.detail,'error')
            }
          }).catch(function (err) {
            console.log(err);
          }).finally(function (fn) {
            console.log(fn);
          })
        }
      },mounted:function () {
      this.getsdcardinfo()
    }
    }
</script>

<style scoped>
  >>> .el-progress-bar{
    width: 98%;
  }
</style>
